<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>月嫂详情</title>

	<link rel="stylesheet" type="text/css" href="css/style.css">
	<link rel="stylesheet" type="text/css" href="css/style.css">
	<script type="text/javascript" src="js/Adaptive.js"></script>
	<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>
	<script type="text/javascript" src="js/vue/vue.js"></script>
</head>
<body>

	<section id="MaxCon" style="background-color: #f0f1f5;">
		<header id="headerCon">
			<div class="info">
				<div class="headPhoto">
					<a href="javascript:void(0);">
						<img src="images/img_01.jpg">
					</a>
				</div>
				<div class="word">
					<div class="heOne">
						<div class="name">张阿姨</div>
						<div class="rank">金牌月嫂</div>
					</div>
					<div class="price">16800元/26天</div>
				</div>
			</div>
			<ul class="infoList">
				<li>
					<div class="name">经验</div>
					<div class="index">8年</div>
				</li>
				<li>
					<div class="name">经验</div>
					<div class="index">8年</div>
				</li>
				<li>
					<div class="name">经验</div>
					<div class="index">8年</div>
				</li>
				<li>
					<div class="name">经验</div>
					<div class="index">8年</div>
				</li>
				<li>
					<div class="name">经验</div>
					<div class="index">8年</div>
				</li>
			</ul>
		</header>

		<section class="pubModo">
			<h3>工作经历</h3>
			<ul class="workExperience">
				<li>
					<div class="time">1<i>月</i></div>
					<div class="timeLine">
						<span class="yes" style="width: 50%"></span>
						<span class="no" style="width: 50%"></span>
					</div>
				</li>

				<li>
					<div class="time">1<i>月</i></div>
					<div class="timeLine">
						<span class="yes" style="width: 50%"></span>
						<span class="no" style="width: 50%"></span>
					</div>
				</li>

				<li>
					<div class="time">1<i>月</i></div>
					<div class="timeLine">
						<span class="yes" style="width: 50%"></span>
						<span class="no" style="width: 50%"></span>
					</div>
				</li>

				<li>
					<div class="time">1<i>月</i></div>
					<div class="timeLine">
						<span class="yes" style="width: 50%"></span>
						<span class="no" style="width: 50%"></span>
					</div>
				</li>

				<li>
					<div class="time">1<i>月</i></div>
					<div class="timeLine">
						<span class="yes" style="width: 50%"></span>
						<span class="no" style="width: 50%"></span>
					</div>
				</li>

				<li>
					<div class="time">1<i>月</i></div>
					<div class="timeLine">
						<span class="yes" style="width: 50%"></span>
						<span class="no" style="width: 50%"></span>
					</div>
				</li>

				<li>
					<div class="time">1<i>月</i></div>
					<div class="timeLine">
						<span class="yes" style="width: 50%"></span>
						<span class="no" style="width: 50%"></span>
					</div>
				</li>

				<li>
					<div class="time">1<i>月</i></div>
					<div class="timeLine">
						<span class="yes" style="width: 50%"></span>
						<span class="no" style="width: 50%"></span>
					</div>
				</li>

				<li>
					<div class="time">1<i>月</i></div>
					<div class="timeLine">
						<span class="yes" style="width: 50%"></span>
						<span class="no" style="width: 50%"></span>
					</div>
				</li>

				<li>
					<div class="time">1<i>月</i></div>
					<div class="timeLine">
						<span class="yes" style="width: 50%"></span>
						<span class="no" style="width: 50%"></span>
					</div>
				</li>

				<li>
					<div class="time">1<i>月</i></div>
					<div class="timeLine">
						<span class="yes" style="width: 50%"></span>
						<span class="no" style="width: 50%"></span>
					</div>
				</li>

				<li>
					<div class="time">1<i>月</i></div>
					<div class="timeLine">
						<span class="yes" style="width: 50%"></span>
						<span class="no" style="width: 50%"></span>
					</div>
				</li>
			</ul>
			<div class="Annotation">色为可预约的时间哦</div>
		</section>


		<section class="pubModo">
			<h3>工作照片</h3>
			<div class="photoCon">
				<ul class="photoList" style="width: 880px;">
					<li>
						<img src="images/img_02.jpg">
						<div class="ind">2017/05 月嫂</div>
					</li>
					<li>
						<img src="images/img_02.jpg">
						<div class="ind">2017/05 月嫂</div>
					</li>
					<li>
						<img src="images/img_02.jpg">
						<div class="ind">2017/05 月嫂</div>
					</li>
					<li>
						<img src="images/img_02.jpg">
						<div class="ind">2017/05 月嫂</div>
					</li>
				</ul>
			</div>
		</section>


		<section class="pubModo">
			<h3>工作照片</h3>
			<div class="photoCon">
				<ul class="photoList" style="width: 1260px;">
					<li style="width: 300px;height: 200px;">
						<img src="images/img_03.jpg">
					</li>

					<li style="width: 300px;height: 200px;">
						<img src="images/img_03.jpg">
					</li>

					<li style="width: 300px;height: 200px;">
						<img src="images/img_03.jpg">
					</li>

					<li style="width: 300px;height: 200px;">
						<img src="images/img_03.jpg">
					</li>
					
				</ul>
			</div>
		</section>

		<section class="pubModo">
			<h3>工作照片</h3>
			
		</section>


	</section>





	<div id="app">
		{{ message }}
	</div>

	<script type="text/javascript">
		var app = new Vue({
			el: '#app',
			data: {
				message: 'Hello Vue!'
			}


		})
	</script>
</body>
</html>